<!--
 * @Descripttion:
 * @version:
 * @Author: jiating
 * @Date: 2021-02-22 17:03:48
 * @LastEditors: jiating
 * @LastEditTime: 2021-02-24 14:59:55
-->
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>K5G-C</title>
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./css/home.css" />
</head>

<body>
<div class="main">
    <div class="tit-heade">
        <div class="itemOne">
            <img src="./image/left.png" >
        </div>
        <div class="itemTwo">
            <div class="item-chil">
                <img src="./image/logoutOne.png">
            </div>
            <div class="item-chil">
                <a href="/action/logout">ログアウト</a>
            </div>
            
        </div>
    </div>
    <div class="nav2" style="height: 285vh;">
        <div class="nav-item">
            <div id='x1' class="item choose" onclick="toPage('./home.html')">ホーム</div>
        </div>
        <div class="nav-item">
            <div id='x2' class="item no-act" onclick="toPage('./mobileData.html')">モバイルネットワーク</div>
        </div>
        <div class="nav-item">
            <div id='x3' class="item no-act" onclick="toPage('./wifi.html')">Wi-Fi設定</div>
        </div>
        <div class="nav-item">
            <div id='x4' class="item no-act" onclick="toPage('./dhcp.html')">Ethernet設定</div>
        </div>
        <div class="nav-item">
            <div id='x5' class="item no-act" onclick="toPage('./port.html')">LAN設定</div>
            
        </div>
        <div class="nav-itm">
            <div id='x6' class="item no-act" onclick="toPage('./password.html')">端末設定</div>
        </div>
    </div>

    <div id="home" class="content" style="height: 285vh;">
        <div class="title">K5G-C</div>
        <form action="" class="default-form">
            <table class="input-table" style="table-layout: fixed;" width="80%">
                <tbody>
                <tr>
                    <th><label class="default-label" for="">WAN IPv4アドレス</label></th>
                    <td >
                        <div id="num1"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">WAN IPv6アドレス</label></th>
                    <td>
                        <div id="num2"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">ネットワークプロバイダ</label></th>
                    <td>
                        <div id="num3"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">モバイルネットワーク</label></th>
                    <td>
                        <div id="num4"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">WAN RSSI</label></th>
                    <td>
                        <div id="num5"></div>
                    </td>
                </tr>
                <!-- <tr>
                    <th><label class="default-label" for="">LAN 接続デバイス数</label></th>
                    <td>
                        <div id="num15"></div>
                    </td>
                </tr> -->
                <tr>
                    <th><label class="default-label" for="">Wi-Fi</label></th>
                    <td>
                        <div id="num6"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">LAN Wi-Fi SSID</label></th>
                    <td>
                        <div id="num7"></div>
                    </td>
                </tr>
                <!-- <tr>
                    <th><label class="default-label" for="">LAN Wi-Fi IPv4アドレス</label></th>
                    <td>
                        <div id="num8"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">LAN Wi-Fi IPv6アドレス</label></th>
                    <td>
                        <div id="num9"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">LAN Ethernet IPv4アドレス</label></th>
                    <td>
                        <div id="num10"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">LAN Ethernet IPv6アドレス</label></th>
                    <td>
                        <div id="num11"></div>
                    </td>
                </tr> -->
                <tr>
                    <th><label class="default-label" for="">モバイルデータ使用量(SIMスロット1)</label></th>
                    <td>
                        <div id="num13"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">データ使用量の警告の設定(SIMスロット1)</label></th>
                    <td>
                        <div id="num18"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">データ使用量のリセット日(SIMスロット1)</label></th>
                    <td>
                        <div id="num14"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">モバイルデータ使用量(SIMスロット2)</label></th>
                    <td>
                        <div id="num16"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">データ使用量の警告の設定(SIMスロット2)</label></th>
                    <td>
                        <div id="num19"></div>
                    </td>
                </tr>
                <tr>
                    <th><label class="default-label" for="">データ使用量のリセット日(SIMスロット2)</label></th>
                    <td>
                        <div id="num17"></div>
                    </td>
                </tr>
                </tbody>
            </table>

            <!-- <div class="form-box" style="padding: 30px">
                <div style="color: #333333; font:bold; font-size: 24px; border-bottom: 1px solid #000">接続デバイス
                </div>
            </div> -->
            <!-- <div class="mac" style="padding: 0 5%">
                <table class="default-table" id="wifi-table">
                    <thead>
                      <tr>
                        <th>Hostname</th>
                        <th>WiFi</th>
                        <th>IPv4 address</th>
                        <th>IPv6 address</th>
                        <th>MAC address</th>
                      </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div> -->
        </form>

    </div>

</div>

<script type="text/javascript" src="./js/utils.js"></script>
<script>

    window.onload = function () {
        Message.info('読み込みに時間がかかりますので、しばらくお待ちください。')
        getData()
        getSimNum()
    }

    function getSimNum() {
        var params = {}
        Ajax.post(baseUrl + '/action/getActiveSimCardNumber', JSON.stringify(params), function(res) {
            var response = JSON.parse(res)
            if (response.status == 'success') {
                sessionStorage.setItem('activeSimNumber', response.data.activeSimNumber)
            }
        })
        var num = sessionStorage.getItem('activeSimNumber')
        if (num == 0) {
            var btn = document.getElementById('x2')
            btn.onclick = function() {}
            btn.style.backgroundColor = '#eee'
        }
    }

    function getData(){
        
        var params = {}
        Ajax.post(baseUrl + '/action/home', JSON.stringify(params), function (res) {
            var response = JSON.parse(res)
            var apBand = ''
                if(response.data.apBand == 0){
                    apBand = '2.4GHz'
                }
                if(response.data.apBand == 1){
                    apBand = '5GHz'
                }
                if(response.data.apBand == 2){
                    apBand = '2.4GHz/5GHz'
                }
            // var devivceNum = response.data.onlineDevices
            // var box = document.getElementById("wifi-table").children[1]
            // for(var i = 0 ; i< devivceNum.length; i++) {
            //     var item = devivceNum[i]
            //     var tr = document.createElement('tr')
            //     tr.innerHTML = `<td>${item.deviceName || ' '}</td>
            //     <td>${apBand || ' '}</td>
            //     <td>${item.ipAddress || ' '}</td>
            //     <td>${item.ip6Address || ' '}</td>
            //     <td>${item.macAddress || ' '}</td>`
            //     box.appendChild(tr)
            // }
            if (response.status == 'success') {
                if(response.data[0]){
                    document.getElementById('num13').innerText = response.data[0].usageData || ''
                    document.getElementById('num18').innerText = response.data[0].warningData || ''
                    document.getElementById('num14').innerText = response.data[0].start_time || ''
                }

                if(response.data[1]){
                    document.getElementById('num16').innerText = response.data[1].usageData || ''
                    document.getElementById('num19').innerText = response.data[1].warningData || ''
                    document.getElementById('num17').innerText = response.data[1].start_time || ''
                }
                
                document.getElementById('num1').innerText = response.data.ipv4.replace(',',' ') || ''
                document.getElementById('num2').innerText = response.data.ipv6.replace(',',' ') || ''
                document.getElementById('num3').innerText = response.data.network_provider_Name || ''
                document.getElementById('num4').innerText = response.data.network_rat || ''
                document.getElementById('num5').innerText = response.data.network_rssi || ''
                document.getElementById('num6').innerText = apBand || ''
                document.getElementById('num7').innerText = response.data.apSSID || ''
                // document.getElementById('num8').innerText = response.data.apDeviceIp || ''
                // document.getElementById('num9').innerText = ''
                // document.getElementById('num10').innerText = response.data.lanEthIpv4 || ''
                // document.getElementById('num11').innerText = response.data.lanEthIpv6 || ''
                
                // document.getElementById('num15').innerText = response.data.online_device_number || '0'
                
                // Message.showmsg(response.message)
            } else {
                Message.showmsg(response.message)
            }
        })
    }



</script>
</body>

</html>
